<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>美食达人页面</title>
    <style>
        /*样式重置 */
        * {
            margin: 0;
            padding: 0;
        }

        a {
            text-decoration: none;
        }

        ul {
            list-style: none;
        }

        body {
            background-color: #f5f5f5;
        }

        /* 头部   开始 */
        .header {
            width: 100%;
            background-color: #ac000f;
        }

        /* 头部 版心 */
        .center {
            width: 1000px;
            margin: 0 auto;
        }

        /* 头部   开始 */
        .center .header_a {
            width: 990px;
            height: 129px;
            background-color: #ac000f;
        }

        /* logo  背景图 */
        .center .header_a .logo {
            display: block;
            width: 184px;
            height: 129px;
            background-image: url(../msdr_images/logo2.png);
            background-repeat: no-repeat;
            background-position: -30px 11px;
            float: left;
        }

        /* 头部  输入框 */
        .center .header_a .search {
            width: 430px;
            background-color: white;
            float: left;
            margin-top: 45px;
            margin-left: 68px;
            height: 38px;
            border-radius: 4px;
            position: relative;
            border: 1px solid #fff;
        }

        .center .header_a .text {
            width: 349px;
            padding: 12px 0;
            border-top-left-radius: 4px;
            border-bottom-left-radius: 4px;
            border: 0;
            font-size: 12px;
            outline: none;
        }

        .center .header_a .search button {
            width: 80px;
            height: 36px;
            background-color: #ac000f;
            border: 0;
            position: absolute;
            top: 1px;
            color: white;
            border-top-right-radius: 4px;
            border-bottom-right-radius: 4px;
            font-size: 16px;
        }

        /* 登录 */
        .center .login {
            width: 224px;
            height: 129px;
            background-color: #ac000f;
            float: right;
            line-height: 129px;
        }

        .center .login .aa {
            width: 28px;
            height: 28px;
            background-image: url(../msdr_images/login.gif);
            background-repeat: no-repeat;
            background-image: 0px 28px;
            padding-left: 28px;
            background-size: 28px 45px;
            background-position: 0px -3px;
        }

        .center .login .bb {
            width: 28px;
            height: 28px;
            background-image: url(../msdr_images/login.gif);
            background-repeat: no-repeat;
            background-image: 0px 28px;
            padding-left: 28px;
            background-size: 28px 48px;
            background-position: 0px -28px;
        }

        .center .login .cc {
            padding: 0 10px;
        }

        .center .login a {
            font-size: 12px;
            color: white;
        }

        .center .login a:hover {
            text-decoration: underline;
            background-color: #76000a;
            border-radius: 5px;
            height: 25px;
        }

        /* 头部结束 */

        /* 导航  开始 */
        .nav {
            width: 100%;
            box-shadow: 0 0 20px #888888;
            margin-bottom: 20px;
        }

        /* 导航版心 */
        .nav_center {
            width: 990px;
            height: 76px;
            margin: 0 auto;
            /* border: 1px solid #000; */
        }

        .nav_center ul {
            height: 76px;
        }

        .nav_center li {
            float: left;
            margin: 0 auto;

        }

        .nav_center li a {
            display: block;
            width: 120px;
            line-height: 76px;
            text-align: center;
            color: #000;
            font-weight: bold;
            font-size: 19px;
        }


        /* 轮播图 */

        .rotation_hart_center {
            width: 1030px;
            height: 344px;
            margin: 0 auto;
            display: flex;
            overflow: hidden;
        }

        .rotation_hart_center .list {
            width: 3090px;
            display: flex;
            animation: move1 12s infinite linear;
        }

        .rotation_hart_center .list li {
            width: 1030px;
            margin: 0 auto;
        }

        .rotation_hart_center .list li img {
            width: 1030px;
            height: 344px;
            display: block;
        }

        @keyframes move1 {
            0% {
                transform: translateX(0);
            }

            100% {
                transform: translateX(-100%);
            }
        }

        /* 头像 */
        .head_sculpture {
            width: 1030px;
            height: 140px;
            margin: 40px auto 0;
            /* border: 1px solid #000; */
            display: flex;
        }

        .head_sculpture div {
            width: 93px;
            height: 140px;
            border: 1px solid white;
            transition: all 0.5s;
        }

        .head_sculpture div img {
            display: block;
            width: 64px;
            height: 64px;
            border-right: 2px solid #f5f5f5;
            margin: 20px auto 0;
            border-radius: 32px;
        }

        .head_sculpture div .head_sculpture_a {
            width: 60px;
            display: block;
            margin: 15px auto 0;
            color: #fff;
            text-align: center;
            background-color: aquamarine;
            border-radius: 5px;
        }

        .head_sculpture div:hover {
            height: 160px;
            background-color: #33d9fd;
        }

        .head_sculpture div:nth-child(2) .head_sculpture_a {
            background-color: #ff7c7c;
        }

        .head_sculpture div:nth-child(3) .head_sculpture_a {
            background-color: #ff4233
        }

        .head_sculpture div:nth-child(4) .head_sculpture_a {
            background-color: #ffc533;
        }

        .head_sculpture div:nth-child(5) .head_sculpture_a {
            background-color: #77bf2e;
        }

        .head_sculpture div:nth-child(6) .head_sculpture_a {
            background-color: #3cc55f;
        }

        .head_sculpture div:nth-child(7) .head_sculpture_a {
            background-color: #33ddaf;
        }

        .head_sculpture div:nth-child(8) .head_sculpture_a {
            background-color: #33d9fd;
        }

        .head_sculpture div:nth-child(9) .head_sculpture_a {
            background-color: #6c37ad;
        }

        .head_sculpture div:nth-child(10) .head_sculpture_a {
            background-color: #b933be;
        }

        .head_sculpture div:nth-child(11) .head_sculpture_a {
            background-color: #fa74dd;
        }


        /* 标题一   模块 */
        .title_one_modular {
            width: 1050px;
            height: 736px;
            /* border: 1px solid #000; */
            margin: 0 auto;
            background-color: #f5f5f5;
        }

        .title_one_modular_title {
            height: 120px;
            text-align: center;
            line-height: 120px;
            font-weight: 500;
        }

        .title_one_modular .detail_card {
            width: 1050px;
            height: 616px;
            /* border: 1px solid #33d9fd; */
            margin: 0 auto;
            display: flex;
            flex-wrap: wrap;
        }

        .detail_card div {
            width: 330px;
            height: 288px;
            /* border: 1px solid #000; */
            margin: 0 10px 20px;
            box-sizing: border-box;
        }

        .detail_card>div:hover {
            box-shadow: 0px 3px 5px 3px #888888;
        }

        .detail_card .detail_card_img img {
            width: 100%;
            height: 186px;
            /* background-color: #3cc55f; */
            display: block;
        }

        .detail_card .detail_card_detail {
            width: 330px;
            height: 102px;
            background-color: white;
            margin: -1px;
            padding: 12px 20px 16px 20px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .detail_card_detail a {
            color: black;
        }

        .detail_card .detail_card_detail a:hover {
            color: #ff4c35;
        }

        .detail_card_detail .detail_card_num {
            height: 24px;
            font-size: 12px;
            color: #e8e8e8;
            line-height: 24px;
            margin: 0;
            border: 0;
        }

        .detail_card_detail .detail_card_detail_a {
            color: #ff4c35;
            font-size: 12px;
        }

        .detail_card_detail .detail_card_detail_a:hover {
            text-decoration: underline;
        }

        /* 标题二模块 */
        .title_two_modular {
            width: 1050px;
            margin: 0 auto;
            /* border: 1px solid #000; */
            display: flex;
        }

        .title_two_modular .title_two_modular_left {
            width: 505px;
            height: 514px;
            /* border: 1px solid #000; */
            margin: 0 10px;
        }

        .title_two_modular .title_two_modular_right {
            width: 505px;
            height: 514px;
            /* border: 1px solid #000; */
            margin: 0 10px;
        }

        .title_two_modular h2 {
            height: 84px;
            line-height: 84px;
            font-weight: 500;
            margin: 0 auto;
            /* background-color: #33d9fd; */
            text-align: center;
        }

        .title_two_modular_left_bigimg {
            width: 473px;
            background-color: #fff;
            margin: 0 auto;
            margin-bottom: 4px;
            padding: 16px;
        }

        .title_two_modular_left_bigimg img {
            width: 473px;
        }

        .title_two_modular_left_smallimg img {
            width: 150px;
            height: 84px;
            margin: 2px;
        }


        .title_two_modular_right_bigimg {
            width: 473px;
            background-color: #fff;
            margin: 0 auto;
            margin-bottom: 4px;
            padding: 16px;
        }

        .title_two_modular_right_bigimg img {
            width: 473px;
            height: 267px;
        }

        .title_two_modular_right_smallimg img {
            width: 150px;
            height: 84px;
            margin: 2px;
        }

        .title_three_modular {
            width: 1050px;
            height: 600px;
            margin: 0 auto;
            /* border: 1px solid #000; */

        }

        .title_three_modular>div {
            margin: 0 10px;
            box-sizing: border-box;
            border: 1px solid white;
            background-color: white;

        }

        .title_three_modular h2 {
            height: 84px;
            text-align: center;
            line-height: 84px;
            padding-top: 36px;
            font-weight: 500;
            /* border: 1px solid #000; */

        }

        .title_three_modular_left {
            width: 345px;
            height: 480px;
            float: left;
        }

        .title_three_modular_center {
            width: 345px;
            height: 480px;
            border: 1px solid #000;
            float: left;
        }

        .title_three_modular_right {
            width: 300px;
            height: 480px;
            border: 1px solid #000;
            float: left;
        }

        .title_three_modular_left h4 {
            height: 60px;
            line-height: 60px;
            padding-left: 10px;
            font-size: 15px;
            font-weight: 500;
            border-bottom: 1px solid gray;
        }

        .title_three_modular_left_list>div {
            height: 50px;
            margin-top: 17px;
            padding-left: 10px;
            box-sizing: border-box;
        }

        .title_three_modular_left_list img {
            width: 50px;
            height: 50px;
            border-radius: 25px;
            float: left;
        }

        .title_three_modular_list_title {
            float: left;
        }

        .title_three_modular_list_title a {
            color: black;
            font-size: 17px;
            line-height: 25px;
            display: block;
            margin-left: 8px;

        }

        .title_three_modular_list_title a:hover {
            color: #ff4c35;
            text-decoration: underline;
        }

        .title_three_modular_left_list p {
            font-size: 13px;
            color: gray;
            width: 240px;
            float: left;
            margin-left: 8px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }


        .title_three_modular_center h4 {
            height: 60px;
            line-height: 60px;
            padding-left: 10px;
            font-size: 15px;
            font-weight: 500;
            border-bottom: 1px solid gray;
        }

        .title_three_modular_center_list>div {
            height: 50px;
            margin-top: 17px;
            display: flex;
            padding-left: 10px;
            box-sizing: border-box;
        }

        .title_three_modular_center_list img {
            width: 50px;
            height: 50px;
            border-radius: 25px;
            float: left;
        }

        .title_three_modular_center_list a:nth-child(2) {
            padding-left: 5px;
            color: #000;
            font-size: 17px;
        }

        .title_three_modular_center_list p {
            font-size: 12px;
            width: 120px;
            padding-left: 55px;
            padding-top: 3px;
            color: gray;
        }

        .title_three_modular_center_list button {
            padding: 1px 4px;
            color: white;
            background-color: #ff4c35;
            border: 0;
            height: 25px;
            margin-left: 115px;
            margin-top: 12px;
        }

        .title_three_modular_right_top {
            height: 155px;
            background: url(../img/msdrbg.png) no-repeat 3px;
        }

        .title_three_modular_right p {
            font-size: 14px;
            padding: 0 30px;
            margin-top: 20px;
            text-indent: 2em;
            color: #666;
        }

        .title_three_modular_right button {
            display: block;
            margin: 120px auto;
            padding: 10px 40px;
            color: white;
            background-color: #ff4c35;
            border: 0;
            font-size: 18px;
        }

        .title_three_modular_right button:hover {
            background-color: #e90808;
        }

        /*********************************/
        /* 标题四模块*/
        .title_four_modular {
            width: 1050px;
            height: 894px;
            /* border: 1px solid #33d9fd; */
            margin: 0 auto;
        }

        .title_four_modular h3 {
            text-align: center;
            height: 120px;
            line-height: 150px;
            font-size: 24px;
            font-weight: 500;
            border: 1px solid #f5f5f5;
            background-color: #f5f5f5;
        }

        .title_four_modular>div {
            width: 1030px;
            height: 116px;
            padding: 0 10px;
            border-bottom: 1px dotted #f5f5f5;
            background-color: white;
            display: flex;
        }

        .title_four_modular img {
            height: 70px;
            margin: 23px 15px;
        }

        .title_four_modular_card {
            height: 28px;
            margin-top: 30px;
        }

        .title_four_modular_card span {
            padding: 4px 10px;
            background-color: #ff7c7c;
            color: white;
            font-size: 12px;
            border-radius: 3px;
        }

        .title_four_modular_card a {
            color: black;
            font-size: 18px;
            padding-left: 3px;
        }

        .title_four_modular a:hover {
            color: #ff7c7c;
            text-decoration: underline;
        }

        .title_four_modular b {

            display: block;
            margin-top: 64px;
            margin-left: -297px;
            font-size: 14px;
        }

        .title_four_modular p {
            margin-top: -18px;
            margin-left: -229px;
            font-size: 13px;
            color: #999;
        }

        .title_four_modular i {
            width: 20px;
            margin: 48px 7px 0 72px;
            background: url(../img/msdr_jb.png) no-repeat;
        }

        .title_four_modular .jiangli {
            display: block;
            line-height: 116px;
            font-weight: 600;
            color: #ffd431;
            font-size: 17px;
        }

        .title_four_modular button {
            width: 90px;
            height: 37px;
            border: 0;
            border-radius: 5px;
            margin-top: 40px;
            margin-left: 15px;
            color: white;
            background-color: #ddd;
            font-size: 14px;
        }

        .title_four_modular_card2_center {
            width: 500px;
        }

        .title_four_modular_card2_center span {
            line-height: 86px;
            padding: 5px 10px;
            background-color: #ff7c7c;
            border-radius: 3px;
            color: white;
            font-size: 12px;
        }

        .title_four_modular_card2_center a {
            color: black;
            font-size: 17px;
        }

        .title_four_modular_card2_center strong {
            margin-top: -22px;
            width: 60px;
            display: block;
            font-size: 14px;
        }

        .title_four_modular_card2_center p {
            margin-left: 64px;
        }

        .title_four_modular_card2_right {
            background: url(../img/msdr_jb.png) no-repeat 30px 50px;
        }

        .title_four_modular_card2_right span {
            display: block;
            line-height: 116px;
            margin-left: 59px;
            color: #ffd330;
            font-size: 17px;
            font-weight: bold;
        }

        .title_four_modular_card2_right .btn {
            border: 0;
            margin-left: 14px;
        }

        .title_four_modular_card3_right {
            margin-left: 32px;
            background: url(../img/msdr_jb.png) no-repeat 30px 50px;
        }

        .title_four_modular_card3_right span {
            display: block;
            line-height: 116px;
            margin-left: 59px;
            color: #ffd330;
            font-size: 17px;
            font-weight: bold;
        }

        .title_four_modular_card3_right .btn {
            border: 0;
            margin-left: 14px;
        }

        .title_four_modular .title_four_modular_foot {
            justify-content: center;
            align-items: center;
            height: 60px;
        }

        .title_four_modular .title_four_modular_foot a {
            color: black;
        }

        .title_four_modular .title_four_modular_foot a:hover {
            color: #ff7c7c;
        }

        /* *********标题四  模块 结束************ */


        /* **********************标题五  模块   开始***************** */
        .title_modular_five_title {
            width: 1050px;
            margin: 0 auto;
            /* background-color: #33d9fd; */
            text-align: center;
            font-size: 23px;
            padding: 45px 0;
            font-weight: 500;
        }


        .title_modular_five .detail_card {
            width: 1050px;
            height: 616px;
            /* border: 1px solid #33d9fd; */
            margin: 0 auto;
            display: flex;
            flex-wrap: wrap;
        }

        /* ***********************标题五  模块  结束****************************** */

        /* ****************标题六  模块  开始**************** */

        .title_modular_six {
            width: 100%;
            height: 220px;
            margin: 0 auto;
            background-color: #000;
        }

        .title_modular_six_main {
            width: 990px;
            margin: 0 auto;
        }

        .title_modular_six_left {
            float: left;
        }

        .title_modular_six_left img {
            padding: 30px 0;
            width: 380px;
            height: 150px;
            padding-left: 40px;
        }

        .title_modular_six_right {
            display: flex;
            padding-left: 62px;
        }

        .title_modular_six_right>div {
            width: 105px;
            height: 160px;
            margin: 31px 10px;
            border: 1px solid #000;

        }

        .title_modular_six_right div img {
            width: 105px;
        }

        .title_modular_six_right div p {
            text-align: center;
        }

        .title_modular_six_right div p a {
            color: #999;
            font-size: 12px;
            text-align: center;
        }

        .title_modular_six_right div p a:hover {
            text-decoration: underline;
            color: white;
        }
            /* ******************标题六 模块  结束******************* */

            /* *******************页尾  开始********************** */

            .gourmet_master_page_footer{
                width: 100%;
                background-color: #000;
            }
            .gourmet_master_page_footer_center{
                width: 990px;
                margin: 0 auto;
            }
            .gourmet_master_page_footer_center ul{
                display: flex;
                justify-content: center;
                padding: 40px;
                padding-bottom: 10px;
            }
            .gourmet_master_page_footer_center ul li a{
                margin: 0 5px;
                font-size: 12px;
                color: #999;
                padding: 4px 10px;
            }
            .gourmet_master_page_footer_center ul li a:hover{
                background-color: #ff3232;
            }

            .gourmet_master_page_footer_center p{
                text-align: center;
                font-size: 12px;
                color: #999;
            }
           /* *******************页尾  结束********************** */
    </style>


</head>

<body>
    <!-- 美食达人页面 -->
    <div class="gourmet_master_page">
        <!-- 头部 -->
        <div class="header">
            <!-- 版心 -->
            <div class="center">
                <!-- 头部  开始 -->
                <div class="header_a">
                    <!-- logo -->
                    <a href="msj_sy.html " target="_blank" class="logo"></a>
                    <!-- 搜索框 -->
                    <div class="search">
                        <input type="text" class="text" placeholder="请输入菜谱/食材/菜单/作者" autocomplete="none">
                        <button>搜索</button>
                    </div>
                    <!-- 登录 -->
                    <div class="login">
                        <a href="#" class="aa">QQ登录</a>
                        <a href="#" class="bb">微博登录</a>
                        <a href="#" class="cc">登录</a>
                    </div>
                </div>
            </div>
        </div>
        <!-- 头部  结束 -->

        <!-- 导航开始 -->
        <div class="nav">
            <div class="nav_center">
                <ul>
                    <li><a href="#">首页</a></li>
                    <li><a href="#">菜谱大全</a></li>
                    <li><a href="#">饮食健康</a></li>
                    <li><a href="#">美食菜单</a></li>
                    <li><a href="msj_msdr.html" target="_blank">家居馆</a></li>
                    <li><a href="#">美食达人</a></li>
                    <li><a href="#">菜谱视频</a></li>
                    <li><a href="#">产品下载</a></li>
                </ul>
            </div>
        </div>

        <!-- 轮播图 -->

        <div class="rotation_hart">
            <div class="rotation_hart_center">
                <ul class="list">
                    <li><img src="../img/meshidaren_lunbo1.jpg" alt=""></li>
                    <li><img src="../img/meishidaren_lunbo2.png" alt=""></li>
                    <li><img src="../img/meishidare_lunbo3.png" alt=""></li>
                    <li><img src="../img/meshidaren_lunbo1.jpg" alt=""></li>
                    <li><img src="../img/meishidaren_lunbo2.png" alt=""></li>
                    <li><img src="../img/meishidare_lunbo3.png" alt=""></li>
                </ul>
            </div>
        </div>

        <!-- 头像 -->
        <div class="head_sculpture">
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">中式菜</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">西式菜</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">烘培</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">素食</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">轻食</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">一人食</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">孕婴</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">养生</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">技巧</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">品位家</a>
            </div>
            <div>
                <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                <a href="#" class="head_sculpture_a">营养师</a>
            </div>
        </div>

        <!-- 标题 一 -->
        <div class="title_one_modular">
            <h1 class="title_one_modular_title">内容精选</h1>
            <div class="detail_card">
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card1.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">摆地摊火了，卖它特赚钱，香辣小吃人人爱</a>
                        <div class="detail_card_num">10426浏览 · 13评论 · 15赞</div>
                        <a href="#" class="detail_card_detail_a">寻找桃花岛</a>
                    </div>
                </div>

                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card2.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">带鱼这样做最香！外酥里嫩麻辣入味</a>
                        <div class="detail_card_num">4775浏览 · 3评论 · 7赞</div>
                        <a href="#" class="detail_card_detail_a">孩妈妮妮</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card3.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">自己在家做的战斧牛排，比外面卖的还好吃！</a>
                        <div class="detail_card_num">12973浏览 · 2评论 · 6赞</div>
                        <a href="#" class="detail_card_detail_a">尚食之文</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card4.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">第一次尝试用奶酪做饼干，没想到味道这么香甜</a>
                        <div class="detail_card_num">2081浏览 · 1评论 · 2赞</div>
                        <a href="#" class="detail_card_detail_a">石榴树2008</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card5.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">自制樱花麦旋风，低脂低糖，好吃不怕胖</a>
                        <div class="detail_card_num">2779浏览 · 4评论 · 5赞</div>
                        <a href="#" class="detail_card_detail_a">寻找米米</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card6.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">半个小时做一盘有蔬菜的儿童肠</a>
                        <div class="detail_card_num">2835浏览 · 2评论 · 2赞</div>
                        <a href="#" class="detail_card_detail_a">清水鱼翅的厨房</a>
                    </div>
                </div>

            </div>
        </div>


        <!-- 标题二模块 -->
        <div class="title_two_modular">
            <div class="title_two_modular_left">
                <h2>大咖专栏</h2>
                <div class="title_two_modular_left_bigimg">
                    <a href="#"><img src="../img/pic1.jpeg" alt=""></a>
                    <div class="title_two_modular_left_smallimg">
                        <a href="#"><img src="../img/small1.jpeg" alt=""></a>
                        <a href="#"><img src="../img/small2.jpeg" alt=""></a>
                        <a href="#"><img src="../img/small3.jpeg" alt=""></a>
                    </div>
                </div>
            </div>
            <div class="title_two_modular_right">
                <h2>热门活动</h2>
                <div class="title_two_modular_right_bigimg">
                    <a href="#"><img src="../img/pic2.jpeg" alt=""></a>
                    <div class="title_two_modular_right_smallimg">
                        <a href="#"><img src="../img/small4.png" alt=""></a>
                        <a href="#"><img src="../img/small5.png" alt=""></a>
                        <a href="#"><img src="../img/small6.jpeg" alt=""></a>
                    </div>
                </div>
            </div>
        </div>


        <!-- 标题三 模块 -->
        <div class="title_three_modular">
            <h2>达人榜单</h2>
            <div class="title_three_modular_left">
                <h4>新晋达人</h4>
                <div class="title_three_modular_left_list">
                    <div>
                        <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                        <div class="title_three_modular_list_title"><a href="#">章鱼小丸子 </a></div>
                        <p>会烘培、会烹饪!</p>
                    </div>
                    <div>
                        <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                        <div class="title_three_modular_list_title"><a href="#">天使、懂得 </a></div>
                        <p>把生活中的好吃的好喝的还有美好和大家分享！</p>
                    </div>
                    <div>
                        <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                        <div class="title_three_modular_list_title"><a href="#">千里马马</a> </div>
                        <p>爱做饭，爱分享。期待和各位大厨谦虚交流共享</p>
                    </div>
                    <div>
                        <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                        <div class="title_three_modular_list_title"><a href="#">lisa5385</a></div>
                        <p>喜欢做菜，擅长做家常菜和海鲜，在其他平台有作品</p>
                    </div>
                    <div>
                        <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                        <div class="title_three_modular_list_title"><a href="#">巧克力-木木妈妈 </a></div>
                        <p>热爱下厨，热爱生活，想要和大家分享制作美食的乐趣</p>
                    </div>
                    <div>
                        <a href="#"><img src="../img/touxiang.jpg" alt=""></a>
                        <div class="title_three_modular_list_title"><a href="#">零度甜品</a></div>
                        <p>想成为达人，发更多菜谱。喜欢美食，喜欢吃，也喜欢做。</p>
                    </div>
                </div>
            </div>
            <div class="title_three_modular_center">
                <h4>热门达人</h4>
                <div class="title_three_modular_center_list">
                    <div>
                        <div title_three_modular_center_list_follow>
                            <a href="#">
                                <img src="../img/touxiang.jpg" alt="">
                            </a>
                            <a href="#">老房小雨</a>
                            <p>本月热度:13361</p>
                        </div>
                        <button>关注</button>

                    </div>
                    <div>
                        <div title_three_modular_center_list_follow>
                            <a href="#">
                                <img src="../img/touxiang.jpg" alt="">
                            </a>
                            <a href="#">杜姐厨房</a>
                            <p>本月热度:10827</p>
                        </div>
                        <button>关注</button>
                    </div>
                    <div>
                        <div title_three_modular_center_list_follow>
                            <a href="#">
                                <img src="../img/touxiang.jpg" alt="">
                            </a>
                            <a href="#">雪峰儿</a>
                            <p>本月热度:8783</p>
                        </div>
                        <button>关注</button>
                    </div>
                    <div>
                        <div title_three_modular_center_list_follow>
                            <a href="#">
                                <img src="../img/touxiang.jpg" alt="">
                            </a>
                            <a href="#">sourcehe</a>
                            <p>本月热度:7466</p>
                        </div>
                        <button>关注</button>
                    </div>
                    <div>
                        <div title_three_modular_center_list_follow>
                            <a href="#">
                                <img src="../img/touxiang.jpg" alt="">
                            </a>
                            <a href="#">禾小荷</a>
                            <p>本月热度:7245</p>
                        </div>
                        <button>关注</button>
                    </div>
                    <div>
                        <div title_three_modular_center_list_follow>
                            <a href="#">
                                <img src="../img/touxiang.jpg" alt="">
                            </a>
                            <a href="#">林冰儿</a>
                            <p>本月热度:6012</p>
                        </div>
                        <button>关注</button>
                    </div>
                </div>
            </div>
            <div class="title_three_modular_right">
                <div class="title_three_modular_right_top"></div>
                <p>成为达人即可享受不一样的特权专属标识、优先推荐、更高的积分体系、更多的家居馆折扣…想要施展才华、展现魅力的你，快来申请成为美食达人吧~</p>
                <button>申请达人</button>
            </div>
        </div>
        <!-- ---------------------------------------------------- -->
        <!-- 标题四模块 -->
        <div class="title_four_modular">
            <h3>达人任务</h3>
            <div>
                <a href="#">
                    <img src="../img/msdr_rw1.png" alt="">
                </a>
                <div class="title_four_modular_card">
                    <span>中式菜</span>
                    <a href="#">七鲜超市∣潮流火锅 自有生活</a>
                </div>
                <div>
                    <b>一级任务</b>
                    <p>| 浏览:1188 | 申请名额:150 | 申请人数:54 | 截止时间:12月21日 23:59</p>
                </div>
                <i></i>
                <span class="jiangli">奖励: 火锅底料大礼包</span>
                <button>已过期</button>

            </div>


            <div>
                <div class="title_four_modular_card2_left">
                    <img src="../img/msdr_rw2.png" alt="">
                </div>
                <div class="title_four_modular_card2_center">
                    <span>中式菜</span>
                    <a href="#">斑斓世家斑斓粉，增色提香的东方香草</a>
                    <strong>一级任务</strong>
                    <p>| 浏览:1188 | 申请名额:150 | 申请人数:54 | 截止时间:12月21日 23:59</p>
                </div>
                <div class="title_four_modular_card2_right">
                    <span>奖励: 斑斓世界斑斓粉
                        <button class="btn">已过期</button>
                    </span>

                </div>
            </div>
            <div>
                <div class="title_four_modular_card2_left">
                    <img src="../img/msdr_rw3.png" alt="">
                </div>
                <div class="title_four_modular_card2_center">
                    <span>中式菜</span>
                    <a href="#">亚麻公社胡麻油，植物油中的脑白金</a>
                    <strong>一级任务</strong>
                    <p>| 浏览:1188 | 申请名额:150 | 申请人数:54 | 截止时间:12月21日 23:59</p>
                </div>
                <div class="title_four_modular_card3_right">
                    <span>奖励: 醇香胡麻油
                        <button class="btn">已过期</button>
                    </span>

                </div>
            </div>
            <div>
                <div class="title_four_modular_card2_left">
                    <img src="../img/msdr_rw4.png" alt="">
                </div>
                <div class="title_four_modular_card2_center">
                    <span>中式菜</span>
                    <a href="#">斑斓世家斑斓粉,清新诱惑回归本质原味</a>
                    <strong>一级任务</strong>
                    <p>| 浏览:1188 | 申请名额:150 | 申请人数:54 | 截止时间:12月21日 23:59</p>
                </div>
                <div class="title_four_modular_card2_right">
                    <span>奖励: 斑斓世家斑斓粉
                        <button class="btn">已过期</button>
                    </span>

                </div>
            </div>
            <div>
                <div class="title_four_modular_card2_left">
                    <img src="../img/msdr_rw5.png" alt="">
                </div>
                <div class="title_four_modular_card2_center">
                    <span>中式菜</span>
                    <a href="#">亚麻公社胡麻油，植物油中的脑白金</a>
                    <strong>一级任务</strong>
                    <p>| 浏览:1188 | 申请名额:150 | 申请人数:54 | 截止时间:12月21日 23:59</p>
                </div>
                <div class="title_four_modular_card3_right">
                    <span>奖励: 醇香胡麻油
                        <button class="btn">已过期</button>
                    </span>

                </div>
            </div>
            <div>
                <div class="title_four_modular_card2_left">
                    <img src="../img/msdr_rw6.png" alt="">
                </div>
                <div class="title_four_modular_card2_center">
                    <span>中式菜</span>
                    <a href="#">锦恩记节补汤，更适合现代人体质的滋补汤</a>
                    <strong>一级任务</strong>
                    <p>| 浏览:1188 | 申请名额:150 | 申请人数:54 | 截止时间:12月21日 23:59</p>
                </div>
                <div class="title_four_modular_card3_right">
                    <span>奖励: 节补汤料包
                        <button class="btn">已过期</button>
                    </span>

                </div>
            </div>

            <div class="title_four_modular_foot"><a href="#">查看更多任务 > ></a></div>

        </div>

        <!-- ---------------标题四   模块  结束---------------- -->

        <!-- ----------------标题五模块  开始--------------------- -->
        <h3 class="title_modular_five_title">优质内容</h3>
        <div class="title_modular_five">
            <div class="detail_card">
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card1.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">摆地摊火了，卖它特赚钱，香辣小吃人人爱</a>
                        <div class="detail_card_num">10426浏览 · 13评论 · 15赞</div>
                        <a href="#" class="detail_card_detail_a">寻找桃花岛</a>
                    </div>
                </div>

                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card2.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">带鱼这样做最香！外酥里嫩麻辣入味</a>
                        <div class="detail_card_num">4775浏览 · 3评论 · 7赞</div>
                        <a href="#" class="detail_card_detail_a">孩妈妮妮</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card3.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">自己在家做的战斧牛排，比外面卖的还好吃！</a>
                        <div class="detail_card_num">12973浏览 · 2评论 · 6赞</div>
                        <a href="#" class="detail_card_detail_a">尚食之文</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card4.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">第一次尝试用奶酪做饼干，没想到味道这么香甜</a>
                        <div class="detail_card_num">2081浏览 · 1评论 · 2赞</div>
                        <a href="#" class="detail_card_detail_a">石榴树2008</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card5.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">自制樱花麦旋风，低脂低糖，好吃不怕胖</a>
                        <div class="detail_card_num">2779浏览 · 4评论 · 5赞</div>
                        <a href="#" class="detail_card_detail_a">寻找米米</a>
                    </div>
                </div>
                <div>
                    <a href="#" class="detail_card_img">
                        <img src="../img/card6.jpeg" alt="">
                    </a>
                    <div href="#" class="detail_card_detail">
                        <a href="#">半个小时做一盘有蔬菜的儿童肠</a>
                        <div class="detail_card_num">2835浏览 · 2评论 · 2赞</div>
                        <a href="#" class="detail_card_detail_a">清水鱼翅的厨房</a>
                    </div>
                </div>

            </div>

        </div>


        <!-- --------------标题五模块   结束--------------------------- -->



        <!-- -------------------------标题 六模块--- 开始--------------- -->
        <div class="title_modular_six">
            <div class="title_modular_six_main">
                <div class="title_modular_six_left">
                    <img src="../img/msdr_footer_logo.png" alt="">
                </div>
                <div class="title_modular_six_right">
                    <div class="title_modular_six_right_one">
                        <a href="#"><img src="../img/msdr_wb.png" alt=""></a>
                        <p><a href="#">点击进入<br>美食杰官网微博</a></p>

                    </div>
                    <div class="title_modular_six_right_two">
                        <a href="#"><img src="../img/msdr_qq.png" alt=""></a>
                        <p><a href="#">点击进入<br>美食杰QQa空间</a></p>
                    </div>
                    <div class="title_modular_six_right_three">
                        <a href="#"><img src="../img/msdr_erweima.png" alt=""></a>
                        <p><a href="#">扫描二维码添加<br>美食杰为微信好友</a></p>
                    </div>
                    <div class="title_modular_six_right_four">
                        <a href="#"><img src="../img/msdr_apperweima.png" alt=""></a>
                        <p><a href="#">扫描二维码<br>美食杰为微信好友</a></p>
                    </div>
                </div>
            </div>
        </div>
        <!-- -------------------标题 六  结束------------------ -->

        <!-- ---------------页尾 开始--------------- -->

        <div class="gourmet_master_page_footer">
            <div class="gourmet_master_page_footer_center">
                <ul>
                    <li> <a href="#">公司简介</a></li>
                    <li> <a href="#">关于我们</a></li>
                    <li> <a href="#">产品下载</a></li>
                    <li> <a href="#">加入我们</a></li>
                    <li> <a href="#">联系我们</a></li>
                    <li> <a href="#">商务合作</a></li>
                    <li> <a href="#">用户协议</a></li>
                    <li> <a href="#">隐私政策</a></li>
                    <li> <a href="#">网站地图</a></li>
                    <li> <a href="#">友情链接</a></li>
                </ul>
                <p><p class="beiwen">京ICP备14030359号-1/<img src="../img/guohui.png">京公网安备11010802026928 Copyright &copy; 2003-2021 MEISHI CO.,LTD.</p></p>
            </div>
        </div>
         <!-- ---------------页尾 结束--------------- -->
    </div>
</body>

</html>